<template>
  <div  v-show="dialogVisible">
    <viewer>
      <img src="../../../public/img/you-know.png" alt="" class="product_img" style="width: 100%" id="imgNav">
    </viewer>
  </div>
</template>

<script>
    export default {
        name: "DialogNav",
        data() {
            return {
                dialogVisible: false,
            }
        },
        mounted() {
            this.bus.$on('showNav', () => {
               this.dialogVisible=true;
               this.$nextTick(()=>{
                   this.dialogVisible=false;
                   var e = document.createEvent("MouseEvents");
                   e.initEvent("click", true, true);
                   document.getElementById("imgNav").dispatchEvent(e);
               })
            })
        },
        beforeDestroy() {
            this.bus.$off('showNav')
        }
    }
</script>

<style scoped lang="scss">

</style>
